<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>开卡赠礼</title>
    <link rel="stylesheet" href="__STATIC_URL__/static/mobile/css/weui.css" />
    <style type="text/css">


        .weui-flex{
            width:100%;
        }
        .weui-flex__item{
            width:160px;
            text-align:center;
            padding:3px 10px;
            height:80px;
        }
        .semi_circle {
            width:14px;
            height:7px;
            background-color:#edf0f3;
            border-radius:0 0 7px 7px;
            position:relative;
            top:0px;
            right:7px;

        }
        .semi_circle1 {
            width:14px;
            height:7px;
            background-color:#edf0f3;
            border-radius:7px 7px 0 0;
            position:relative;
            bottom: -80px;

            left: -20px;

        }

    </style>
</head>
<body>
<div class="minecard" style="">
    <!--我的卡券-->
    {volist name="cardlist" id="vo"}
    {neq name="vo.zs_card_id" value=""}
    <a {lt name="vo.get_sume" value="vo.put_sume"}href="javascript:;"{/lt} class="weui-media-box clickself weui-media-box_appmsg" data-givelogid="{$vo['id']}" data-url="{:url('cardget/getaddcard')}" data-cardid="{$vo['zs_card_id']}" style="background:#fff;margin:10px 15px;border-radius:6px;border: 1px solid #f3f3f3;">
        <div class="weui-flex">

            <div class="weui-flex__item"style="background:{if condition="$vo.get_sume < $vo.put_sume"}{:getcolor(cardgetinfo($vo['zs_card_id'],1,3))}{else} #ddd{/if};border-radius:6px;font-size:14px;color:#fff;">

            <p style="font-size:1.2rem;padding-top:31%;"> 
                {if condition="$vo.get_sume < $vo.put_sume"}
                <span style="font-size:12px;"> 发放{$vo['put_sume']}</span>
                <span style="font-size:12px;"> /已领{$vo['get_sume']}</span>
                {else}
                已领取
                {/if}
            </p>
            </div>
            <div class="semi_circle"></div>
            <div class="semi_circle1"></div>
            <div class="weui-flex__item">
                <p style="margin-top:5%;">{$vo.zs_card_id|cardgetinfo=###,1,1}</p>

                <p style="background: {if condition="$vo.get_sume < $vo.put_sume"}{:getcolor(cardgetinfo($vo['zs_card_id'],1,3))}{else} #ddd{/if};border-radius:4px;color:#fff;font-size:13px;">{:get_cardid_type($vo['zs_card_id'])}</p>
                <p style="">{neq name=":filteroffcard($vo['zs_card_id'])" value="true"}已过期{/neq}</p>

            </div>
            <div class="weui-flex__item">

            </div>

        </div>
    </a>
{/neq}
    {/volist}



</div>

</body>

<script src="__STATIC_URL__/static/jquery/3.2.1/jquery.min.js"></script>
<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript">
    $(function () {

        $(".clickself").click(function () {
            var url = $(this).attr("data-url");
            var cardid = $(this).attr("data-cardid");
            var givelogid = $(this).attr('data-givelogid');
            console.log(url);
            $.post({
                url: url,
                data: {
                    card_id: cardid,
                    givelogid: givelogid,
                    url: window.location.href
                },
                success: function (data) {

                    wx.config({
                        debug: false,
                        appId: data.jssdk.appId,
                        timestamp: data.jssdk.timestamp,
                        nonceStr: data.jssdk.nonceStr,
                        signature: data.jssdk.signature,
                        jsApiList: [
                            'addCard'
                        ]
                    });
                    wx.ready(function () {
                        wx.addCard({
                            cardList: [
                                {
                                    cardId: cardid,
                                    cardExt: data.card.ext
                                }
                            ],
                            success: function (res) {
                                window.location.replace("{:url('cardget/cardgetsuccess')}")
                            },
                        });
                    });
                }
            })
        })
    });
</script>
 </html>
